<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
                template="./template.xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core">

    <ui:define name="top">
        Registration
    </ui:define>

    <ui:define name="left">
    </ui:define>



    <ui:define name="body">
        <h:form id="registerForm">
                <h:panelGrid columns="3" border="0">
                    <h:outputLabel for="firstname">First Name:</h:outputLabel>
                    <h:inputText label="First Name" id="firstname" value="#{userCTRL.user.firstName}">
                        <f:validator validatorId="validators.generalLengthValidator"/>
                    </h:inputText>
                    <h:message for="firstname"/>

                    <h:outputLabel for="lastname">Last Name:</h:outputLabel>
                    <h:inputText label="Last Name" id="lastname" value="#{userCTRL.user.lastName}">
                        <f:validator validatorId="validators.generalLengthValidator"/>
                    </h:inputText>
                    <h:message for="lastname"/>

                    <h:outputLabel for="username">Username:</h:outputLabel>
                    <h:inputText 
                        id="username" 
                        value="#{userCTRL.user.login}">
                        <f:validator validatorId="validators.generalLengthValidator"/>
                    </h:inputText>
                    <h:message for="username"/>

                    <h:outputLabel for="password">Password:</h:outputLabel>
                    <h:inputSecret label="Password" id="password" value="#{userCTRL.user.password}">
                        <f:validator validatorId="validators.passwordValidator"/>
                    </h:inputSecret>
                    <h:message for="password"/>

                    <h:outputLabel for="confirm">Confirm:</h:outputLabel>
                    <h:inputSecret id="confirm" value="#{userCTRL.user.password}"/>
                    <h:panelGroup/>

               
                    <h:outputLabel for="country">Country:</h:outputLabel>
                    <h:inputText label="Country" id="country" value="#{userCTRL.user.country}">
                        <f:validator validatorId="validators.generalLengthValidator"/>
                    </h:inputText>
                    <h:message for="country"/>

                    <h:outputLabel for="state">State:</h:outputLabel>
                    <h:inputText label="State" id="state" value="#{userCTRL.user.state}">
                        <f:validator validatorId="validators.stateValidator"/>
                    </h:inputText>
                    <h:message for="state"/>

                    <h:outputLabel for="city">City:</h:outputLabel>
                    <h:inputText label="City" id="city" value="#{userCTRL.user.city}">
                        <f:validator validatorId="validators.generalLengthValidator"/>
                    </h:inputText>
                    <h:message for="city"/>

                    <h:outputLabel for="address">Address:</h:outputLabel>
                    <h:inputText label="Address" id="address" value="#{userCTRL.user.address}">
                        <f:validator validatorId="validators.addressValidator"/>
                    </h:inputText>
                    <h:message for="address"/>

                    <h:outputLabel for="zip">Zip Code:</h:outputLabel>
                    <h:inputText label="Zip code" id="zip" value="#{userCTRL.user.zip}">
                        <f:validator validatorId="validators.zipCodeValidator"/>
                    </h:inputText>
                    <h:message for="zip"/>

                </h:panelGrid>  
            
            <h:commandButton 
                action="#{userCTRL.register}" 
                value="Register"
                onclick="
                    var pass = true;
                    if (document.getElementById('clientDetailsForm:password').value != document.getElementById('clientDetailsForm:confirm').value)
                        pass = false;
                    return pass;
                "/>
            
        </h:form>
    </ui:define>

</ui:composition>
